호이스팅(Hoisting)이란 무엇인가

#resource

#javascript

작성일:2025. 4. 17.

수정일:2025. 4. 19.

호이스팅은 자바스크립트 엔진이 코드를 실행하기 전에 변수, 함수, 클래스의 선언 부분을 해당 스코프의 최상단으로 끌어올리는 것처럼 동작하는 현상을 말한다.

엔진이 코드를 해석할 때 선언부를 먼저 처리하기 때문에 마치 끌어올려진 것처럼 보인다.

`var`,`let`,`const`의 호이스팅의 차이#

var 변수 선언(var myVar;)이 스코프 최상단으로 끌어올려지고, 동시에 undefined로 초기화된다. 따라서 선언문 이전에 변수에 접근해도 에러가 발생하지 않고 undefined 값을 가진다.
```
JavaScriptjs
```
let,const 변수 선언이 스코프 최상단으로 끌어올려지지만, 초기화 되지는 않는다. 선언문 이전에 해당 변수에 접근하려고 하면 초기화되기 전까지 접근할 수 없다는 referenceError가 발생한다. 이 구간을 **시간적 사각지대(Temporal Dead One, TDZ)**라고 한다.
```
JavaScriptjs
```
함수 선언식 함수 선언식(function myFunction(){})은 함수 전체가 호이스팅되어 선언 전에 호출할 수 있다. 함수 표현식(function myFunction(){})은 변수 호이스팅 규칙(여기서는 const)을 따른다.
```
JavaScriptjs
```

Tip

호이스팅은 특히var을 사용할 때 코드의 실행 순서와 변수 값 예측을 어렵게 만들 수 있다.let과 const의 도입 및 TDZ는 이러한 혼란을 줄이고 더 예측 가능한 코드를 작성하는 데 도움을 준다.